<template>
  <div class="ui-page ui-page__scroll lesson-evaluate">
    <div class="evaluate-header">
      <span></span>
      <div class="evaluate-submit" @click="handleClickSubmiteEvaluate()">提交</div>
    </div>

    <div class="evaluate-score">
      <div class="evaluate-score--desc">{{ scoreMap[score] }}</div>
      <view class="evaluate-score--rate">
        <uiRate :value="score" allow-half count="5" @change="onChangeScope"></uiRate>
      </view>
    </div>
    <textarea class="evaluate-textarea" placeholder="感谢您的认可，留下您的评价可以帮助更多学员哦" v-model="content"></textarea>
  </div>
</template>

<script>
import uiIcon from "@/components/base/icon/index";
import uiRate from "@/components/base/rate/index";
import { addLessonComment } from "api/order/lession.js";
export default {
  name: "LessonEvaluate",
  components: { uiRate },
  data() {
    return {
      score: 0,
      scoreMap: {
        0: "点击星星评分",
        0.5: "非常糟糕",
        1: "非常糟糕",
        1.5: "有待提高",
        2: "有待提高",
        2.5: "一般般",
        3: "一般般",
        3.5: "还不错",
        4: "还不错",
        4.5: "非常好",
        5: "非常好"
      },
      lessonId: "",
      content: ""
    };
  },
  onLoad() {
    const curUrl = this.$url();
    // this.lessonId = curUrl.query.id || "353";
    this.lessonId = "353";
  },
  created() {},
  mounted() {},
  methods: {
    /**
     * 提交评论内容
     */
    handleClickSubmiteEvaluate() {
      if (this.score == 0) {
        this.$toast("请选择评分");
        return;
      }
      if (this.content.trim() == "") {
        this.$toast("评价内容不能为空");
        return;
      }
      if (this.content.trim().length >= 200) {
        this.$toast("评价内容只能在200字以内");
        return;
      }
      this.$toast.loading({
        message: "加载中...",
        forbidClick: true,
        overlay: true
      });
      var params = {
        lessonId: this.lessonId,
        commentLv: this.score,
        content: this.content
      };
      addLessonComment(params).then(({ respCode, respMsg, result }) => {
        this.$toast.clear(true);
        if (respCode !== "0") {
          this.$toast.fail(respMsg);
          return;
        }
        this.$toast.success("回复成功");
        this.$router.push({
          path: `/lession/detail`,
          query: {
            id: this.lessonId,
            sid: this.$route.query.sid
          }
        });
      });
    },

    onChangeScope(score) {
      debugger;
      this.score = score;
    }
  }
};
</script>

<style lang="scss" src="./index.scss"></style>
